<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui"
                template="../templates/principal.xhtml">

    <ui:define name="content" id="content">
        <h:form id="frmPlanoConta">
            <p:panel id="panel" header="Bem Vindo ao Cadastro do Plano de Contas">
                <p:growl id="messages" life="5000" />

                <p:dataTable id="tabPlanoConta" widgetVar="wtabPlanoConta" var="planoconta" value="#{planoContasBean.lazyModel}" 
                             lazy="true" paginator="true" rows="12" paginatorPosition="top" filterEvent="enter"
                             emptyMessage="Nenhum Registro Retornado ..." style="text-align: left;">

                    <p:column headerText="Conta" filterBy="#{planoconta.numConta}">
                        <h:outputText value="#{planoconta.numConta}" />
                    </p:column>

                    <p:column headerText="Reduzido" filterBy="#{planoconta.reduzido}">
                        <h:outputText value="#{planoconta.reduzido}" />
                    </p:column>

                    <p:column headerText="Nome" filterBy="#{planoconta.nome}" style="text-align: left;">
                        <h:outputText value="#{planoconta.nome}" />
                    </p:column>

                    <p:column headerText="Saldo Anterior" style="text-align: right;">
                        <h:outputText value="#{planoconta.saldoanterior}">
                            <f:convertNumber locale="pt_BR" pattern="#,##0.00" minFractionDigits="2" />
                        </h:outputText>
                    </p:column>

                    <p:column headerText="Débitos" style="text-align: right;">
                        <h:outputText value="#{planoconta.debitos}" >
                            <f:convertNumber locale="pt_BR" pattern="#,##0.00" minFractionDigits="2" />
                        </h:outputText>
                    </p:column>

                    <p:column headerText="Créditos" style="text-align: right;">
                        <h:outputText value="#{planoconta.creditos}">
                            <f:convertNumber locale="pt_BR" pattern="#,##0.00" minFractionDigits="2" />
                        </h:outputText>
                    </p:column>

                    <p:column headerText="Saldo Atual" style="text-align: right;">
                        <h:outputText value="#{planoconta.saldoatual}">
                            <f:convertNumber locale="pt_BR" pattern="#,##0.00" minFractionDigits="2" />
                        </h:outputText>
                    </p:column>

                    <p:column headerText="Anal.">
                        <h:selectBooleanCheckbox value="#{planoconta.tipConta}" disabled="true" />
                    </p:column>

                    <p:column style="width: 100px;">
                        <h:panelGrid columns="4" styleClass="actions" cellpadding="0">
                            <p:commandButton id="selectButton" update=":frmPlanoConta:panel :frmPlanoConta:messages" 
                                             icon="ui-icon-search" title="Visualizar // Alterar Conta Contábel" oncomplete="PF('dialog').show()">
                                <f:setPropertyActionListener value="#{planoconta}" target="#{planoContasBean.selectedPlanoContas}" />
                                <f:setPropertyActionListener value="#{false}" target="#{planoContasBean.salvar}" />
                            </p:commandButton>

                            <p:commandButton id="excluirButton" update=":frmPlanoConta:panel :frmPlanoConta:messages" 
                                             icon="ui-icon-trash" title="Excluir Conta Contábel" oncomplete="PF('confirmation').show()">
                                <f:setPropertyActionListener value="#{planoconta}" target="#{planoContasBean.selectedPlanoContas}" />
                            </p:commandButton>
                        </h:panelGrid>
                    </p:column>

                    <f:facet name="footer">
                        <div style="text-align: left;">
                            <p:commandButton id="incluirButton" actionListener="#{planoContasBean.preparaInserir}" 
                                             update=":frmPlanoConta:panel :frmPlanoConta:messages" value="Nova Conta Contábel"
                                             icon="ui-icon-pencil" title="Cadastrar Nova Conta Contábel" oncomplete="PF('dialog').show()" />
                        </div>
                    </f:facet>

                </p:dataTable>

                <p:dialog id="dialog" header="Detalhes Conta" widgetVar="dialog" resizable="true"
                          width="768" showEffect="explode" hideEffect="explode">

                    <p:tabView id="displayTab" activeIndex="0" effect="height" effectDuration="fast" style="height: 400px;">
                        <p:tab id="tabPrincipal" title="Dados Principais">
                            <h:panelGrid id="display1" columns="2" style="text-align: left;">
                                <h:outputText value="Nome:" />
                                <p:inputText id="inNome" value="#{planoContasBean.selectedPlanoContas.nome}"  
                                             style="width:300px; font-weight:bold; text-transform: uppercase; text-align: left;" />

                                <h:outputText value="Reduzido:" />
                                <p:inputText id="inReduzido" value="#{planoContasBean.selectedPlanoContas.reduzido}" 
                                             onkeyup="javascript:maskIt(this,event,'##########')" maxlength="10"
                                             style="width:150px; font-weight:bold; text-align: right;" />

                                <h:outputText value="Numero:" />
                                <p:inputText id="inNumero" value="#{planoContasBean.selectedPlanoContas.numConta}"  
                                             onkeyup="javascript:maskIt(this,event,'#{planoContasBean.mascaraConta}')" 
                                             style="width:200px; font-weight:bold; text-align: right;" />

                                <h:outputText value="Saldo Anterior:" />
                                <p:inputText id="inSaldoAnterior" value="#{planoContasBean.selectedPlanoContas.saldoanterior}"  
                                             style="width:250px; font-weight:bold; text-align: right;"
                                             onkeyup="javascript:maskIt(this,event,'###.###.###,##',true)">
                                    <f:convertNumber locale="pt_BR" pattern="###,###,##0.00" minFractionDigits="2" />
                                </p:inputText>

                                <h:outputText value="Débitos:" />
                                <p:inputText id="inDebito" value="#{planoContasBean.selectedPlanoContas.debitos}"  
                                             style="width:250px; font-weight:bold; text-align: right;"
                                             onkeyup="javascript:maskIt(this,event,'###.###.###,##',true)">
                                    <f:convertNumber locale="pt_BR" pattern="###,###,##0.00" minFractionDigits="2" />
                                </p:inputText>

                                <h:outputText value="Créditos:" />
                                <p:inputText id="inCredito" value="#{planoContasBean.selectedPlanoContas.creditos}"  
                                             style="width:250px; font-weight:bold; text-align: right;"
                                             onkeyup="javascript:maskIt(this,event,'###.###.###,##',true)">
                                    <f:convertNumber locale="pt_BR" pattern="###,###,##0.00" minFractionDigits="2" />
                                </p:inputText>

                                <h:outputText value="Saldo Atual:" />
                                <p:inputText id="inSaldoAtual" value="#{planoContasBean.selectedPlanoContas.saldoatual}"  
                                             style="width:250px; font-weight:bold; text-align: right;"
                                             onkeyup="javascript:maskIt(this,event,'###.###.###,##',true)">
                                    <f:convertNumber locale="pt_BR" pattern="###,###,##0.00" minFractionDigits="2" />
                                </p:inputText>

                                <h:outputText value="Conta Analítica:" />
                                <h:selectBooleanCheckbox value="#{planoContasBean.selectedPlanoContas.tipConta}" styleClass="ui-widget" />

                            </h:panelGrid>
                        </p:tab>
                        <p:tab id="tabDescricao" title="Descrição">
                            <h:panelGrid id="display2" columns="2" style="text-align: left;">
                                <h:outputText value="Descrição:" style="position: top;" />
                                <p:inputTextarea id="inDescricao" value="#{planoContasBean.selectedPlanoContas.descricao}" 
                                                 style="width:500px; height: 300px; font-weight:bold; text-align: left;" />
                            </h:panelGrid>
                        </p:tab>
                    </p:tabView>
                    <div style="text-align: left;">
                        <p:commandButton value="Inserir" update=":frmPlanoConta:panel :frmPlanoConta:messages" rendered="#{planoContasBean.salvar}"
                                         actionListener="#{planoContasBean.inserir}" oncomplete="handleFormRequest(xhr, status, args)" />
                        <p:commandButton value="Alterar" update=":frmPlanoConta:panel :frmPlanoConta:messages" rendered="#{!planoContasBean.salvar}"
                                         actionListener="#{planoContasBean.alterar}" oncomplete="handleFormRequest(xhr, status, args)" />
                    </div>
                </p:dialog>

                <p:dialog header="Confirma a Exclusão dessa Conta?" widgetVar="confirmation">

                    <p:commandButton value="Excluir" update=":frmPlanoConta:panel :frmPlanoConta:messages"
                                     actionListener="#{planoContasBean.excluir}" oncomplete="PF('confirmation').hide(), PF('dialog').hide()" />
                    <p:commandButton value="Não" onclick="PF('confirmation').hide()" type="button" />

                </p:dialog>
            </p:panel>
        </h:form>
    </ui:define>
</ui:composition>